<template>
  <el-dialog :visible.sync="dialogVisible" title="技术支持" width="50%" :before-close="handleClose">
    <el-form
      :model="ruleForm"
      ref="ruleForm"
      :rules="rules"
      label-width="100px"
      class="demo-ruleForm"
    >
      <el-form-item label="人员姓名" prop="name">
        <el-input v-model="ruleForm.name"></el-input>
      </el-form-item>
      <el-form-item label="联系电话" prop="phone">
        <el-input v-model="ruleForm.phone"></el-input>
      </el-form-item>
      <el-form-item label="工作描述" prop="job">
        <el-input type="textarea" v-model="ruleForm.job"></el-input>
      </el-form-item>
    </el-form>

    <span slot="footer" class="dialog-footer">
      <el-button @click="handleClose">取 消</el-button>
      <el-button type="primary" @click="dialogValue('ruleForm')">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { axios } from "@/api/axios";
// 引入vuex
import { mapGetters } from "vuex";
export default {
  props: {
    dialogVisible: {
      type: Boolean,
      default: true,
    },
    data: {
      type: Object,
      default: true,
    },
    addMode: {
      type: Boolean,
    },
  },
  computed: {
    //获取左侧单位勾选的id数组 [1,2,3]
    ...mapGetters(["userInfo", "selectedComIds"]),
  },
  data() {
    var checkPhone = (rule, value, callback) => {
      if (!value) {
        return callback(new Error("手机号不能为空"));
      } else {
        const reg = /^1[3|4|5|7|8][0-9]\d{8}$/;
        console.log(reg.test(value));
        if (reg.test(value)) {
          callback();
        } else {
          return callback(new Error("请输入正确的手机号"));
        }
      }
    };
    return {
      valueName: "请输入帮助名称",
      titleNode: "下载数目",
      ruleForm: {
        id: "",
        name: "",
        phone: "",
        job: "",
      },
      multipleSelection: [],
      dialogTableVisible: false,
      dialogFormVisible: false,
      rules: {
        name: [{ required: true, message: "请输入姓名", trigger: "blur" }],
        phone: [{ validator: checkPhone, trigger: "blur" }],
        job: [{ required: true, message: "请输入工作描述", trigger: "blur" }],
      },
    };
  },
  watch: {
    data() {
      if (this.addMode == false) {
        if (this.data.length != 0) {
          this.ruleForm = this.data;
          this.ruleForm.loginname = this.userInfo.loginname;
        }
      }
    },
  },
  created() {
    // this.totalNum = this.tableData.length;
    this.comid = this.userInfo.comid;
    this.userid = this.userInfo.userid;
    this.ruleForm.loginname = this.userInfo.loginname;
  },
  methods: {
    handleClose() {
      this.$emit("update:dialogVisible", false);
    },
    // 添加接口
    addLinkman() {
      console.log(this.ruleForm.name, this.ruleForm.job, this.ruleForm.phone);
      axios("/admin/linkman/addLinkman.do", "post", {
        name: this.ruleForm.name,
        job: this.ruleForm.job,
        phone: this.ruleForm.phone,
        companyId: this.comid,
        type: 4,
      }).then((data) => {
        if (data.error == "1") {
          this.$message.error("系统错误，新增失败");
        } else {
          this.$message({
            message: "新增成功",
            type: "success",
          });
          this.empty();
          this.$emit("finish", 1);
          this.$emit("update:dialogVisible", false);
        }
      });
    },
    // 修改接口
    changeLinkmanById() {
      console.log(this.ruleForm.name, this.ruleForm.job, this.ruleForm.phone);
      axios("/admin/linkman/changeLinkmanById.do", "post", {
        id: this.ruleForm.id,
        name: this.ruleForm.name,
        job: this.ruleForm.job,
        phone: this.ruleForm.phone,
        userId: this.ruleForm.userId,
        type: 4,
      }).then((data) => {
        if (data.error == "1") {
          this.$message.error("系统错误，修改失败");
        } else {
          this.$message({
            message: "修改成功",
            type: "success",
          });
          this.empty();
          this.$emit("finish", 1);
          this.$emit("update:dialogVisible", false);
        }
      });
    },
    //  添加数据
    dialogValue(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if (this.addMode) {
            this.addLinkman();
          } else {
            this.changeLinkmanById();
          }
        } else {
          this.$message.error("有错误，请检验是否输入必选项");
          return false;
        }
      });
    },
    empty() {
      this.ruleForm.id = "";
      this.ruleForm.name = "";
      this.ruleForm.job = "";
      this.ruleForm.phone = "";
    },
  },
};
</script>
<style>
</style>
